<template>
	<div class="system-menu-container">
		<div class="breadcrumb-box">
			<Breadcrumb />
		</div>

		<div class="page-main">
      <el-tabs v-model="activeName" class="demo-tabs"  @tabClick="clickTab">
        <el-tab-pane label="预约例数(全院)"  name="first"><appointments-all v-if="activeName=='first'"></appointments-all></el-tab-pane>
        <el-tab-pane label="预约例数（科室）" name="second"><appointments-type  v-if="activeName=='second'" type="1"></appointments-type></el-tab-pane>
        <el-tab-pane label="预约例数（术式）" name="third"><appointments-type  v-if="activeName=='third'" type="2"></appointments-type></el-tab-pane>
        <el-tab-pane label="预约例数（病种）" name="fourth"><appointments-type v-if="activeName=='fourth'" type="4"></appointments-type></el-tab-pane>
        <el-tab-pane label="预约例数（主刀）" name="fifth"><appointments-type  v-if="activeName=='fifth'" type="3"></appointments-type></el-tab-pane>
      </el-tabs>
		</div>


	</div>
</template>

<script setup name="dataStatistics-dataCenter-appointment">
import { storeToRefs } from 'pinia';
import { useRoutesList } from '/@/stores/routesList';
import appointmentsAll from './components/appointmentsAll.vue';
import appointmentsOffice from './components/appointmentsOffice.vue';
import appointmentsOperation from './components/appointmentsOperation.vue';
import appointmentsType from './components/appointmentsType.vue';
import AppointmentsKnife from "./components/appointmentsKnife.vue";

// 引入组件
const Breadcrumb = defineAsyncComponent(() => import('/@/layout/navBars/breadcrumb/breadcrumb.vue'));

// 定义变量内容
const stores = useRoutesList();
const activeName = ref('first');
const state = reactive({
	tableData: {
		data: [],
		loading: true,
	},
});

// 定义方法
const clickTab= (tab, event) => {
  console.log(tab, event)
}




// 页面加载时
onMounted(() => {

});
</script>
